
import Avatar from '@/components/Avatar'
import { Cell, Popup, Space } from '@nutui/nutui-react-taro'
import { View, Text, Image } from '@tarojs/components'
// import { ArrowRight, User } from '@nutui/icons-react'
import ArrowRightSvg from '@/assets/images/personel/personel_arrow_right.svg'
import CameraSvg from '@/assets/images/personel/personel_camera.svg'

import './index.less'

interface Props {
  visible?: boolean
  onClose?: () => void
}

export default function SideMenuDrawer({ visible, onClose }: Props) {
  return (
    <Popup
      closeable
      visible={visible}
      title='标题'
      position='left'
      onClose={onClose}
      style={{ width: '60%' }}
    >
      <View className='sideMenuWraper'>
        <Space align='center'>
          <Avatar />
          <Text>用户名</Text>
          <Text className='position'>公卫监测科</Text>
        </Space>
        <Cell.Group>
          <Cell
            className='nutui-cell-clickable sideMenuCellItem'
            title={
              <Space className='sideMenuCellItemTitle'>
                <Image src={CameraSvg} />
                <Text>更换头像</Text>
              </Space>
            }
            align='center'
            extra={<Image src={ArrowRightSvg} />}
          />
          <Cell
            className='nutui-cell-clickable sideMenuCellItem'
            title='编辑个人资料'
            align='center'
            extra={<Image src={ArrowRightSvg} />}
          />
          <Cell
            className='nutui-cell-clickable sideMenuCellItem'
            title='修改密码'
            align='center'
            extra={<Image src={ArrowRightSvg} />}
          />
          <Cell
            className='nutui-cell-clickable sideMenuCellItem'
            title='修改密码'
            align='center'
            extra={<Image src={ArrowRightSvg} />}
          />
          <Cell
            className='nutui-cell-clickable sideMenuCellItem'
            title='扫码出库'
            align='center'
            extra={<Image src={ArrowRightSvg} />}
          />
        </Cell.Group>
      </View>
    </Popup>
  )
}
